<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>短租排序</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../css/shortrent.shortrent.css">
    <script type="application/javascript" src="../js/jquery-3.3.1.js"></script>
    <script type="application/javascript" src="../js/bootstrap.min.js"></script>
    <script type="application/javascript" src="../layui/layui.js"></script>
    <script type="application/javascript" src="../js/vue.min.js"></script>
</head>
<body id="app">
<div data-v-67ef3a4a class="csdheader">
    <div data-v-67ef3a4a class="layout clear">
        <div data-v-67ef3a4a class="left csdnav">
            <label data-v-67ef3a4a>
                <a data-v-67ef3a4a href="../pagehome/login.html" class="colorRed">登录</a>
                <a data-v-67ef3a4a href="" class="colorRed">/</a>
                <a data-v-67ef3a4a href="../pagehome/register.html" class="colorRed" style="margin-right: 10px;">注册</a>
            </label>


            <a data-v-67ef3a4a="" href="#mobileZuChe">手机租车</a>
            <a data-v-67ef3a4a="" href="helpCenter.html">帮助中心</a>
        </div>
        <div data-v-67ef3a4a="" class="right phone">
            <div data-v-67ef3a4a="" class="typeTab">
                <a data-v-67ef3a4a="" href="index.html" style="color: rgb(199, 0, 11);">中文</a>&nbsp;/&nbsp;
                <a data-v-67ef3a4a="" href="../en/index.html">English</a>
            </div>
            <div data-v-67ef3a4a="" class="menu">
                <a data-v-67ef3a4a="" href="login.html">我的车速递</a>
            </div>
            <div data-v-67ef3a4a="">
                <i class="layui-icon layui-icon-cellphone" style="font-size:14px;  color:#c6000f;"></i>
                <span data-v-67ef3a4a="">400-919-8000</span>
            </div>
        </div>

    </div>
</div>


<div data-v-39f7f629 class="csdnav">
    <div data-v-39f7f629="" class="layout clear">
        <div data-v-39f7f629="" class="left logo">
            <a data-v-39f7f629="" href="loginSuccess">
                <img data-v-39f7f629="" src="">
            </a>
        </div>
        <div data-v-39f7f629="" class="left navCom">
            <ul data-v-39f7f629="">
                <li data-v-39f7f629="" >

                    <a data-v-39f7f629="" href="https://www.chesudi.com/module/activity.html" target="_self" >优惠活动</a>
                </li>
                <li data-v-39f7f629="">
                    <a data-v-39f7f629="" href="https://www.chesudi.com/module/joinWork.html" target="_blank" class="">加盟合作</a>
                </li>
                <li data-v-39f7f629="">
                    <a data-v-39f7f629="" href="https://www.chesudi.com/module/netCar.html" target="_blank" class="">网约车</a>
                </li>
                <li data-v-39f7f629="">
                    <a data-v-39f7f629="" href="https://www.chesudi.com/module/longRent.html" target="_blank" class="">企业长租</a>
                </li>
                <li data-v-39f7f629="">
                    <a data-v-39f7f629="" href="shortrent.html" target="_self" class="colorRed">短租自驾</a>
                </li>
                <li data-v-39f7f629="">
                    <a data-v-39f7f629="" href="loginSuccess" target="_self" >
                        <span data-v-39f7f629="">首页</span></a>
                </li>
            </ul>
        </div>
    </div>
</div>

<div class="selCarMsg" >
    <div class="selCarMsgCom">
        <div class="Msg" >取车地址：{{getcitys}}</div>
    </div>

    <div class="selCarMsgCom">
        <div class="Msg">还车地址：{{backcitys}}</div>
    </div>
</div>



<div class="carListTab">
    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <ul class="layui-tab-title">
            <li class="layui-this">按租金排序</li>
            <li>按热度排序</li>
        </ul>
        <div class="layui-tab-content">


            <div class="layui-tab-item layui-show">
                <!--for循环这段代码-->

                <div class="item clear" id="carlist">
                    <div class="thisPlace clear" id="carli" v-for="site in sites">
                        <div class="itemCarImg left">
                           <img :src="site.picture">
                        </div>
                        <div class="itemCarMsg left" >
                            <h1 id="sitename">{{site.name}}</h1>
                            <p id="sitetype">{{site.type}}</p><p id="sitenum">{{site.sitnum}}座</p>
                        </div>
                        <div class="itemPriceMsg left">
                            <div class="itemPriceMsgC left">
                                <p class="p1">
                                    <span id="siteprice">{{site.price}}</span>/日均
                                </p>
                            </div>
                            <div class="carLiBao">5天以上立减 5元/天</div>
                        </div>

                        <div class="itemBtn left">
                            <button class="butt"  @click="selectCar(site.id)">预定</button>
                        </div>
                    </div>
                </div>

            </div>








            <div class="layui-tab-item">


                <div class="item clear" id="carlis">
                    <div class="thisPlace clear" id="carl" v-for="site in cars">
                        <div class="itemCarImg left">
                            <img  :src="site.picture">
                        </div>
                        <div class="itemCarMsg left" >
                            <h1>{{site.name}}</h1>
                            <p>{{site.type}}</p><p>{{site.sitnum}}座</p>
                        </div>
                        <div class="itemPriceMsg left">
                            <div class="itemPriceMsgC left">
                                <p class="p1">
                                    <span>{{site.price}}</span>/日均
                                </p>
                            </div>
                            <div class="carLiBao">5天以上立减 5元/天</div>
                        </div>

                        <div class="itemBtn left">
                            <button class="butt" @click="selectCar(site.id)" >预定</button>
                        </div>
                    </div>
                </div>



            </div>
        </div>
    </div>


</div>


<script type="text/javascript">

    var getid = window.location.search;
    var vm = new Vue({
        el:'.selCarMsg',
        data:{
            getcitys : '',
            backcitys: ''
        },
    });

   var vm2 = new Vue({
       el:'#carlist',
        data:{
           sites : [],
        },
       methods:{
         selectCar:function (id) {
             window.location.href="ordersubmit"+getid +"&cid=" +id;
         }
       },

    });

    var vm3 = new Vue({
        el:'#carlis',
        data:{
            cars : [],
        },

    });

</script>

<script type="text/javascript">
    $(function(){
        var getid = window.location.search;
        $.ajax({
        type:"get",
        url:"getCity"+getid,
            dataType:"json",
            success:function(data){
                if(data.statusCode==200) {
                 var infos = data.data;
                 var get = infos.getCity;
                 var back = infos.backCity;
                 vm.getcitys = get.name;
                 vm.backcitys = back.name;
            }
        },
        error : function(){
            alert("ajax加载失败");
            }

            })
        })

</script>

<script type="text/javascript">
    $(function(){
        var getid = window.location.search;
        $.ajax({
            type:"get",
            url:"getprice"+getid,
            dataType:"json",
            success:function(data){
                if(data.statusCode==200) {
                    vm2.sites = data.data;

                }
            },
            error : function(){
                alert("ajax加载失败");
            }

        })
    })

</script>

<script type="text/javascript">
    $(function(){
        var getid = window.location.search;
        $.ajax({
            type:"get",
            url:"getnumber"+getid,
            dataType:"json",
            success:function(data){
                if(data.statusCode==200) {
                    vm3.cars = data.data;

                }
            },
            error : function(){
                alert("ajax加载失败");
            }

        })
    })

</script>


<!--<script type="text/javascript">

    function selectCar(cid) {

        window.location.href="../order/ordersubmit.html?cid="+cid;

    }

</script>-->






<script>
    layui.use('element', function(){
        var $ = layui.jquery
            ,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块


    });
</script>




</body>
</html>